<template>
    <div class="page-integral">
        <van-nav-bar
                :fixed="fixed"
                title="积分记录"
                left-text="返回"
                left-arrow
                @click-left="onClickLeft"
        />
        <div v-if="list==''" class="user-list">
            您当前还没有任何记录~~~~~~
        </div>

        <div v-if="list!=''">
            <van-list
                    v-model="loading"
                    :finished="finished"
                    @load="onLoad"
            >
                <van-cell-group :style="{marginTop:'46px'}">
                    <van-cell  :title=item.description :value=-item.score :label=formatTime(item.create_time) v-for="item in list" />
                </van-cell-group>
            </van-list>
        </div>
        <div v-show="usershow" class="loading-no-more">
            我也是有底线的~~~~~~
        </div>
    </div>
</template>

<script>
    import {UserLogs} from "../api/data";
    import Vue from 'vue'
    import { Toast,List } from 'vant';
    Vue.use(Toast,List);
    export default {
        data() {
            return {
                usershow:false,
                page:1,
                loading: false,
                finished: false,
                fixed:true,
                list:[null]
            }
        },
        methods: {
            onLoad() {
                // 异步更新数据
                setTimeout(() => {
                    this.page++
                    UserLogs(this.page).then(res=>{
                        for (let i = 0; i <res.data.data.list.length ; i++) {
                            this.list.push(res.data.data.list[i]);
                        }
                        // 加载状态结束
                        this.loading = false;

                        // 数据全部加载完成
                        if (res.data.data.list.length == 0) {
                            this.usershow=true;
                            this.finished = true;
                        }
                    })
                }, 2000);
            },
            onClickLeft(){
                this.$router.back()
            },
            formatTime(time) {
                let createDate = new Date();
                createDate.setTime(time * 1000);
                return createDate.format('yyyy-MM-dd hh:mm');
            },
        },
        created(){
            UserLogs(this.page).then(res=>{
            if (res.data.code == '10001') {
                Toast('登录已失效，请重新登录！')
                this.$router.push({path:`/login`})
                return
            }
            this.list = res.data.data.list
        })

        },
        computed:{
            token:function () {
                return ""
            }
        }
    };
</script>
<style>
    .page-integral .van-cell__value{
        padding-top: 10px;
    }
</style>
<style scoped>
    .span{
        position: absolute;
        bottom: 0;
        line-height: 40px;
        height: 40px;
        width: 100%;
        text-align: center;
        background-color: #cccccc;
    }
    .user-list{
        margin-top: 47px;
        height: 200px;
        line-height: 200px;
        text-align: center;
       font-size: 14px;
    }
    .card-goods {
        margin-top: 46px;
        padding: 10px 0;
        background-color: #fff;
    }
</style>
